<template>
  <transition name="el-zoom-in-center">
    <div class="JADP-preview-main">
      <div class="JADP-common-page-header" v-if="!resultFlag">
        <el-page-header @back="goBack" content="成绩管理"> </el-page-header>
        <div class="options">
          <el-button @click="goBack">取 消</el-button>
        </div>
      </div>
      <div class="JADP-common-layout">
        <div class="JADP-common-layout-center">
          <el-row class="JADP-common-search-box" :gutter="16">
            <el-form @submit.native.prevent>
              <el-col :span="24" v-if="!resultFlag">
                <el-form-item label="考试标题">
                  <el-select
                    v-model="query.cpid"
                    placeholder="请选择"
                    style="width:290px"
                  >
                    <el-option
                      v-for="(item, index) in paperList"
                      :key="index"
                      :value="item.id"
                      :label="item.examinationtitle"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6" v-if="resultFlag">
                <el-form-item label="班级名称">
                  <el-input
                    v-model="query.clazzname"
                    placeholder="请输入"
                    clearable
                  >
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6" v-if="resultFlag">
                <el-form-item label="考试标题">
                  <el-input
                    v-model="query.examinationtitle"
                    placeholder="请输入"
                    clearable
                  >
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item label="学生姓名">
                  <el-input
                    v-model="query.stuname"
                    placeholder="请输入"
                    clearable
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="6">
                <el-form-item label="考试开始时间">
                  <el-date-picker
                    v-model="query.starttime"
                    type="datetimerange"
                    value-format="timestamp"
                    format="yyyy-MM-dd HH:mm:ss"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col> -->
              <!-- <el-col :span="6">
                  <el-form-item label="考试结束时间">
                    <el-date-picker
                      v-model="query.endtime"
                      type="datetimerange"
                      value-format="timestamp"
                      format="yyyy-MM-dd HH:mm:ss"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col> -->
              <!-- <el-col :span="6">
                  <el-form-item label="学生总分">
                    <el-input
                      v-model="query.stuscore"
                      placeholder="请输入"
                      clearable
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="答卷时长">
                    <el-input
                      v-model="query.answertime"
                      placeholder="请输入"
                      clearable
                    >
                    </el-input>
                  </el-form-item>
                </el-col> -->
              <el-col :span="6" v-if="!resultFlag">
                <el-form-item label="及格分">
                  <el-input
                    v-model="query.jgscore"
                    placeholder="请输入"
                    clearable
                  >
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6">
                <el-form-item>
                  <el-button
                    type="primary"
                    icon="el-icon-search"
                    @click="search()"
                    >查询</el-button
                  >
                  <el-button icon="el-icon-refresh-right" @click="reset()"
                    >重置</el-button
                  >
                  <el-button
                    type="success"
                    style="float:right"
                    @click="batchRelease"
                    >批量审核</el-button
                  >
                </el-form-item>
              </el-col>
            </el-form>
          </el-row>
          <div class="JADP-common-layout-main JADP-flex-main">
            <el-table
              v-loading="listLoading"
              :data="list"
              @sort-change="sortChange"
              @selection-change="handleSelectionChange"
              border
              height="100%"
            >
              <el-table-column
                type="selection"
                width="55"
                :selectable="selecTable"
              >
              </el-table-column>
              <el-table-column
                type="index"
                label="序号"
                width="50"
                align="center"
              >
              </el-table-column>
              <el-table-column prop="clazzname" label="班级名称" align="left" />
              <el-table-column
                prop="examinationtitle"
                label="考试标题"
                align="left"
              />
              <el-table-column prop="papername" label="试卷名称" align="left" />
              <el-table-column prop="stuname" label="学生姓名" align="left" />
              <el-table-column
                prop="starttime"
                label="考试开始时间"
                align="left"
                width="150"
              />
              <el-table-column
                prop="endtime"
                label="考试结束时间"
                align="left"
                width="150"
              />
              <el-table-column
                prop="answertime"
                label="答卷时长"
                align="left"
              />
              <el-table-column
                prop="teststatus"
                label="考试状态"
                align="left"
              />
              <el-table-column
                prop="totalScore"
                label="试卷总分"
                align="left"
              />

              <el-table-column prop="jgscore" label="及格分" align="left" />
              <el-table-column prop="stuscore" label="学生总分" align="left" />
              <el-table-column
                prop="auditstatus"
                label="审核状态"
                align="left"
              />
              <!-- <el-table-column
                v-if="!publishFlag"
                prop="resleasstatus"
                label="是否发布"
                align="left"
              >
                <template v-slot="{ row }">
                  <el-switch
                    v-model="row.resleasstatus"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                    @change="swichChange(row)"
                  >
                  </el-switch>
                </template>
              </el-table-column> -->
              <!-- <el-table-column
                prop="creatortime"
                label="创建时间"
                align="left"
                sortable="custom"
              /> -->
              <el-table-column label="操作" fixed="right" width="150">
                <template slot-scope="scope">
                  <el-button
                    type="text"
                    v-if="scope.row.teststatus == '考试结束'"
                    @click="
                      addOrUpdateHandle(
                        scope.row.cpid,
                        scope.row.stuid,
                        scope.row.clazzid,
                        scope.row.paperid
                      )
                    "
                  >
                    阅卷
                  </el-button>
                  <el-button
                    type="text"
                    v-if="scope.row.teststatus == '考试结束'"
                    @click="audit(scope.row)"
                  >
                    审核
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
            <pagination
              :total="total"
              :page.sync="listQuery.currentPage"
              :limit.sync="listQuery.pageSize"
              @pagination="initData"
            />
          </div>
        </div>
        <ImportBox
          v-if="importBoxVisible"
          ref="importBox"
          @refresh="reset()"
          @ImportPreviewApi="ImportPreviewApi"
          @importDataApi="importDataApi"
          @TemplateDownload="TemplateDownload"
          :URL="URL"
        />
        <JADPForm v-if="formVisible" ref="JADPForm" @refresh="refresh" />
        <Audit v-if="auditVisible" ref="audit_" @refresh="refresh" />
      </div>
    </div>
  </transition>
</template>
<script>
import request from "@/utils/request";
import JADPForm from "./yuejuan.vue";
import Audit from "./audit.vue";
export default {
  name: "chengjiguanli",
  components: { JADPForm, Audit },
  data() {
    return {
      //导入属性
      importBoxVisible: false,
      URL: "scoceManage/Xy_ks_students_scoce",
      showAll: false,
      query: {
        paperid: undefined,
        stuname: undefined,
        starttime: undefined,
        endtime: undefined,
        stuscore: undefined,
        answertime: undefined,
        jgscore: undefined,
        cpid: undefined,
        examinationtitle: undefined,
        clazzname: undefined
      },
      defaultProps: {
        children: "children",
        label: "fullName"
      },
      list: [],
      listLoading: false,
      multipleSelection: [],
      multipleSelection2: [],
      auditVisible: false,
      total: 0,
      listQuery: {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      },
      formVisible: false,
      exportBoxVisible: false,
      clazzid: "",
      publishFlag: true,
      paperList: [], // 已完成试卷的列表
      columnList: [
        { prop: "papername", label: "试卷名称" },
        { prop: "stuname", label: "学生姓名" },
        { prop: "starttime", label: "考试开始时间" },
        { prop: "endtime", label: "考试结束时间" },
        { prop: "answertime", label: "答卷时长" },
        { prop: "jgscore", label: "及格分" },
        { prop: "stuscore", label: "学生总分" },
        { prop: "creatortime", label: "创建时间" }
      ],
      resultFlag: false
    };
  },
  watch: {
    "query.cpid": {
      handler(val) {
        if (!val) return;
        this.initData();
      },
      deep: true,
      immediate: true
    }
  },
  created() {},
  methods: {
    goBack() {
      this.$emit("refresh", true);
    },
    audit(val) {
      this.auditVisible = true;
      this.$nextTick(() => {
        this.$refs.audit_.init(val);
      });
    },
    swichChange(item) {
      if (item.stuscore) {
        request({
          url: `/api/scoreManage/Xy_ks_students_score/${item.id}`,
          method: "put",
          data: {
            resleasstatus: item.resleasstatus
          }
        }).then(res => {
          this.$message.success(res.msg);
        });
      } else {
        item.resleasstatus = false;
        this.$message.warning("请先完成阅卷，在进行成绩发布");
      }
    },
    ImportPreviewApi(val) {
      let query = { fileName: val };
      request({
        url: `/api/scoceManage/Xy_ks_students_scoce/ImportPreview`,
        method: "get",
        data: query
      })
        .then(res => {
          this.$refs.importBox.list = res.data.dataRow;
          this.$refs.importBox.btnLoading = false;
          this.$refs.importBox.active++;
        })
        .catch(() => {
          this.$refs.importBox.btnLoading = false;
        });
    },
    importDataApi(val) {
      let query = { list: val,organizeId :this.$store.getters.organizeId };
      request({
        url: `/api/scoceManage/Xy_ks_students_scoce/ImportData`,
        method: "post",
        data: query
      })
        .then(res => {
          this.$refs.importBox.result = res.data;
          this.$refs.importBox.resultList = res.data.failResult;
          this.$refs.importBox.btnLoading = false;
          this.$refs.importBox.active++;
        })
        .catch(() => {
          this.$refs.importBox.btnLoading = false;
        });
    },
    TemplateDownload() {
      request({
        url: `/api/scoceManage/Xy_ks_students_scoce/templateDownload`,
        method: "post"
      }).then(res => {
        if (!res.data.url) return;
        window.location.href = this.define.comUrl + res.data.url;
      });
    },
    uploadForm() {
      this.importBoxVisible = true;
      this.$nextTick(() => {
        this.$refs.importBox.init(this.columnList);
      });
    },
    sortChange({ column, prop, order }) {
      this.listQuery.sort = order == "ascending" ? "asc" : "desc";
      this.listQuery.sidx = !order ? "" : prop;
      this.initData();
    },
    initData() {
      this.listLoading = true;
      this.query.clazzid = this.clazzid;
      if (this.resultFlag) {
        this.query.auditstatus = "待审核";
      }
      let _query = {
        ...this.listQuery,
        ...this.query,
        organizeId:this.$store.getters.organizeId
      };
      let query = {};
      for (let key in _query) {
        if (Array.isArray(_query[key])) {
          query[key] = _query[key].join();
        } else {
          query[key] = _query[key];
        }
      }
      request({
        url: `/api/scoreManage/Xy_ks_students_score`,
        method: "get",
        data: query
      }).then(res => {
        this.list = res.data.list;
        console.log(this.list, "list");
        this.total = res.data.pagination.total;
        this.listLoading = false;
      });
    },

    //请求获取已考完的试卷列表
    paperinit(id) {
      request({
        url: `/api/clazzpaper/Xy_ks_clazz_paper/getlistByStatus/${id}`,
        method: "get"
      }).then(res => {
        this.paperList = res.data;
        console.log(this.paperList, "this.paperList");
      });
    },
    // 判断是否可勾选
    selecTable(row) {
      // 判断学生总分和发布状态
      if (row.auditstatus == "待审核") {
        return true;
      } else {
        return false;
      }
    },
    // //选择考试标题事件
    // paperListChange(cpid) {
    //   // 通过id获取到具体的对象
    //   let paperObj = this.paperList.filter(item => item.id == cpid)[0];
    //   console.log(paperObj, "paperObj");
    //   this.publishFlag = paperObj.automaticmarking;
    //   this.publishFlag = JSON.parse(this.publishFlag);
    // },

    handleDel(id) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        type: "warning"
      })
        .then(() => {
          request({
            url: `/api/scoceManage/Xy_ks_students_scoce/${id}`,
            method: "DELETE"
          }).then(res => {
            this.$message({
              type: "success",
              message: res.msg,
              onClose: () => {
                this.initData();
              }
            });
          });
        })
        .catch(() => {});
    },
    handleSelectionChange(val) {
      const res = val.map(item => item.id);
      this.multipleSelection = res;
      this.multipleSelection2 = val;
    },
    handleBatchRemoveDel() {
      if (!this.multipleSelection.length) {
        this.$message({
          type: "error",
          message: "请选择一条数据",
          duration: 1500
        });
        return;
      }
      const ids = this.multipleSelection.join();
      this.$confirm("您确定要删除这些数据吗, 是否继续？", "提示", {
        type: "warning"
      })
        .then(() => {
          request({
            url: `/api/scoceManage/Xy_ks_students_scoce/batchRemove/${ids}`,
            method: "DELETE"
          }).then(res => {
            this.$message({
              type: "success",
              message: res.msg,
              onClose: () => {
                this.initData();
              }
            });
          });
        })
        .catch(() => {});
    },
    addOrUpdateHandle(cpid, stuid, clazzid, paperid) {
      this.formVisible = true;
      this.$nextTick(() => {
        this.$refs.JADPForm.init(cpid, stuid, clazzid, paperid);
      });
    },
    exportData() {
      this.exportBoxVisible = true;
      this.$nextTick(() => {
        this.$refs.ExportBox.init(this.columnList);
      });
    },
    download(data) {
      let query = { ...data, ...this.listQuery, ...this.query };
      request({
        url: `/api/scoceManage/Xy_ks_students_scoce/Actions/Export`,
        method: "GET",
        data: query
      }).then(res => {
        if (!res.data.url) return;
        window.location.href = this.define.comUrl + res.data.url;
        this.$refs.ExportBox.visible = false;
        this.exportBoxVisible = false;
      });
    },
    search() {
      this.listQuery = {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      };
      this.initData();
    },
    refresh(isrRefresh) {
      this.formVisible = false;
      this.auditVisible = false;
      if (isrRefresh) this.reset();
    },
    reset() {
      this.query.stuname = undefined;
      this.query.jgscore = undefined;
      this.query.examinationtitle = undefined;
      this.query.clazzname = undefined;
      this.listQuery = {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      };
      this.initData();
    },
    //批量审核
    batchRelease() {
      if (!this.multipleSelection.length) {
        this.$message({
          type: "error",
          message: "请选择一条数据",
          duration: 1500
        });
        return;
      }
      const ids = this.multipleSelection.join();
      request({
        url: `/api/scoreManage/Xy_ks_students_score/batchAudit/${ids}`,
        method: "put"
      }).then(res => {
        this.$message({
          type: "success",
          message: res.msg
        });
        this.initData();
      });
    }
  }
};
</script>
<style scoped lang="less"></style>
